import { h, render } from "vue"
import XtxConfirm from './confirm.vue'
// 1. 创建盛放组件的容器
const divCon = document.createElement('div')
divCon.className = 'xtx-confirm-box-container'
document.body.appendChild(divCon)
// 2. 创建并导出一个Confirm函数
type paramsType = { title: string, text: string }
export default function Confirm({ title, text }: paramsType) {
  // 2.1 创建虚拟dom(基于confirm.vue)
  return new Promise((resolve, reject) => {
    // 确认
    const confirmCallback = () => {
      resolve('confirm')
      render(null, divCon)
    }
    // 取消
    const cancelCallback = () => {
      reject('cancel')
      render(null, divCon)
    }

    const VNode = h(XtxConfirm, { title, text, cancelCallback, confirmCallback })
    // 2.2 挂载虚拟DOM
    render(VNode, divCon)
  })
}